﻿<DemoContainer>
    <ApexChart TItem="Order"
               Title="Order Net Value"
               Options=options>

        <ApexPointTooltip>
            <div class="p-1">

                <h3>@context.DataPoint.X </h3>
                    <Row class="mb-2">
                        <RowCol Auto>
                            <Badge style="background-color:#FF0000">Gross Value</Badge>
                        </RowCol>
                        <RowCol Auto>
                            <span class="@(context.SeriesIndex == 0 ? "strong": "")">
                                @context.DataPoint.Items.Sum(e=> e.GrossValue).ToString("n0")
                            </span>
                        </RowCol>
                    </Row>

                    <Row>
                        <RowCol Auto>
                            <Badge style="background-color:#000080">Net Value</Badge>
                        </RowCol>
                        <RowCol Auto>
                            <span class="@(context.SeriesIndex == 1 ? "strong": "")">
                                @context.DataPoint.Items.Sum(e=> e.NetValue).ToString("n0")
                            </span>
                        </RowCol>
                    </Row>
             
            </div>
        </ApexPointTooltip>

        <ChildContent>
            <ApexPointSeries TItem="Order"
                             Items="Orders"
                             Name="Gross Value"
                             SeriesType="SeriesType.Line"
                             XValue="@(e => e.Country)"
                             YAggregate="@(e => e.Sum(e => e.GrossValue))"
                             OrderByDescending="e=>e.Y"
                             Stroke="@(new SeriesStroke { Color = "#FF0000", Width=4})" />

            <ApexPointSeries TItem="Order"
                             Items="Orders"
                             Name="Net Value"
                             SeriesType="SeriesType.Line"
                             XValue="@(e => e.Country)"
                             YAggregate="@(e => e.Sum(e => e.NetValue))"
                             OrderByDescending="e=>e.Y"
                             Stroke="@(new SeriesStroke { Color = "#000080", Width=4})" />
        </ChildContent>
    </ApexChart>

</DemoContainer>

@code {
    private List<Order> Orders { get; set; } = SampleData.GetOrders();
    private ApexChartOptions<Order> options { get; set; } = new ApexChartOptions<Order>();

    }